
<template>
	<view>
    <u-modal v-model="addresshow" :show-cancel-button="true" content="确认删除此地址" @confirm="deleteaddress"></u-modal>
		<view class="item" v-for="(res, index) in address.list" :key="res.id" @click="xuanzhongdizi(res.id)">
			<view class="top">
				<view class="name">{{ res.recipient_name }}</view>
				<view class="phone">{{ res.recipient_mobile }}</view>
				<view class="tag">
					<text class="red" v-if="res.isDefault">默认</text>
            <text v-if="res.tagname">{{res.tagname}}</text>
				</view>
			</view>
			<view class="bottom">
				{{res.alladdres}}
      <view class="delete" >
        <u-icon name="edit-pen" :size="40" color="#999999" @click.stop="toputaddress(res.id)"></u-icon>
        <u-icon name="trash" :size="40" color="#999999"  @click.stop="deleteres(res.id)"></u-icon>
      </view>
			</view>
		</view>
		<view class="addSite" @tap="toAddSite">
			<view class="add">
				<u-icon name="plus" color="#ffffff" class="icon" :size="30"></u-icon>新建收货地址
			</view>
		</view>
	</view>
</template>

<script setup>
  import { ref } from "vue";
import {
    addressUserStore
  } from "../../store/address.js"
  import {
  	onLoad,
  	onShow
  } from '@dcloudio/uni-app';
  //定义是从首页进入还是订单页面
  const isyemian = ref(false)
  //定义id
  const  goods_id = ref("")
    //定义数量
  const  goodcount = ref("")
  onLoad((option) => {
    isyemian.value = option.value
    goods_id.value = option.goods_id
    goodcount.value = option.goodcount
  })
  //是否弹出确认删除
  const addresshow = ref(false)
  const addressStore = addressUserStore()
  addressStore.getaddress()
  //结构出地址
  const {address} =addressStore
  //定义删除id
  const deleteid  = ref(0)
  function deleteres(id){
    deleteid.value = id
    addresshow.value = true
  }
  //删除地址
  function deleteaddress(){
    addressStore.deleteaddress(deleteid.value)
  }
  //跳转增加地址
  function toAddSite(){
    uni.navigateTo({
      url:"/subPack/Address/addSite"
    })
  }
  //跳转修改地址
  function toputaddress(id){
    uni.navigateTo({
      url:`/subPack/Address/addSite?addressid=${id}`
    })
  }
  //选中订单地址
  function xuanzhongdizi(id){
  
    if(isyemian.value){
        const data = {
          "id":id,
          "goods_id":goods_id.value,
          "goodcount":goodcount.value
        }
        addressStore.getaddre(data)
    }

  }
</script>

<style lang="scss" scoped>
.item {
	padding: 40rpx 20rpx;
	.top {
		display: flex;
		font-weight: bold;
		font-size: 34rpx;
		.phone {
			margin-left: 60rpx;
		}
		.tag {
			display: flex;
			font-weight: normal;
			align-items: center;
			text {
				display: block;
				width: 60rpx;
				height: 34rpx;
				line-height: 34rpx;
				color: #ffffff;
				font-size: 20rpx;
				border-radius: 6rpx;
				text-align: center;
				margin-left: 30rpx;
				background-color:rgb(49, 145, 253);
			}
			.red{
				background-color:red
			}
		}
	}
	.bottom {
		display: flex;
		margin-top: 20rpx;
		font-size: 28rpx;
		justify-content: space-between;
		color: #999999;
    .delete{
      // border: 1px solid red;
      width: 100rpx;
      display: flex;
      justify-content: space-between;
    }
	}
}
.addSite {
	display: flex;
	justify-content: space-around;
	width: 600rpx;
	line-height: 100rpx;
	position: absolute;
	bottom: 30rpx;
	left: 80rpx;
	background-color: red;
	border-radius: 60rpx;
	font-size: 30rpx;
	.add{
		display: flex;
		align-items: center;
		color: #ffffff;
		.icon{
			margin-right: 10rpx;
		}
	}
}
</style>
